import {createElement, findDOMNode, Component} from 'rax';
import Touchable from 'rax-touchable';

export default class Nav extends Component {
    /**
     * 构建函数，处理传入的mds和gdc
     */
    constructor(props) {
      super(props);
      this.state = {
        firstTo: true
      };
    }
  
    componentDidMount() {
      const { isMount } = this.props;
      if (isMount) {
        const box = findDOMNode(this.refs.box); // 获取元素
        setTimeout(() => {
          Tida.transition(box, {
            opacity: 1
          }, {
            timingFunction: 'ease',
            duration: 500
          }, () => {
            this.setState({
              firstTo: false
            });
          });
        }, 0);
      }
    }
  
    render() {
      const {style, animated, children, isMount} = this.props;
      const { firstTo } = this.state;
      const props = {
        style: {
          ...style,
          opacity: isMount && firstTo && animated ? 0 : 1
        },
        ref: 'box'
      };
      return (
        <View {...props}>
          {children}
        </View>
      );
    }
  }
  